/*
 * @Author: luoqi
 * @Date: 2022-04-01 15:41:52
 * @LastEditors: luoqi
 * @LastEditTime: 2022-04-17 18:39:25
 * @Description: 
 */
import React,{ useState } from 'react';
import {  Button,Modal,Form, Input, Radio,Select,Upload, message } from 'antd';
import {  PlusOutlined, UploadOutlined,CheckOutlined} from '@ant-design/icons';
import {connect} from 'react-redux'
import axios from '../../utils/axios'
import qs from 'qs'
const { Option } = Select;



const Modifyvideo = (props) => {
  const {departmentTree,partTree} = props.types;
  let {title,partPid,departmentPid,status}=props.data
  let [form1]=Form.useForm()
  const [isModalVisible, setIsModalVisible] = useState(false);

  const showModal = () => {
    setIsModalVisible(true);
  };

  const handleOk = () => {
    form1.submit()
    setIsModalVisible(false);
  };

  const handleCancel = () => {
    setIsModalVisible(false);
  };
  const onFinish = (values) => {
    console.log('Success:', values);
    let {title,posType,depType}=values
    // 获取用户id
    let id = JSON.parse(sessionStorage.getItem('userinfo')).id;
    //修改
    axios({
      url:'/video/upsert',
      method:'post',
      data:qs.stringify({
        id:props.data.id,
        departmentPid: depType,
        partPid: posType,
        tag:props.data.tag,
        title: title,
        adminId: id,
        url: props.data.url,
        status: values.status == 1 ? true : false,
      })
    }).then(res=>{
      console.log(res);
      props.setNum(1)
    })
  };

  const onFinishFailed = (errorInfo) => {
    console.log('Failed:', errorInfo);
  };
  function handleChange(value) {
    console.log(`selected ${value}`);
  }
  return (
    <div>
      <Button type="primary" ghost onClick={showModal}>修改</Button>
      <Modal title="修改视频" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel} okText="确定"
            cancelText="取消">
        <Form
          name="basic"
          form={form1}
          labelCol={{ span: 5 }}
          wrapperCol={{ span: 16 }}
          onFinish={onFinish}
          onFinishFailed={onFinishFailed}
          autoComplete="off"
          initialValues={{title:title,posType:partPid,depType:departmentPid,status:status?1:0}}
        >
          <Form.Item
            label="视频名称"
            name="title"
            rules={[{ required: true, message: '请输入视频名称' }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="部位一级分类"
            name="posType"
            style={{zIndex:10,position:'relative'}}
          >
            <Select  style={{ width: 120 }} onChange={handleChange}>
              {partTree.map(item=>{
                return <Option key={item.id} value={item.id}>{item.name}</Option>
              })}
            </Select>
          </Form.Item>
          <Form.Item
            label="科室一级分类"
            name="depType"
          >
            <Select style={{ width: 120 }} onChange={handleChange}>
            {departmentTree.map(item=>{
                return <Option key={item.id} value={item.id}>{item.name}</Option>
              })}
            </Select>
          </Form.Item>
          <Form.Item
          label="状态"
          name="status"
        >
          <Radio.Group  >
            <Radio value={1}>可用</Radio>
            <Radio value={0}>不可用</Radio>
          </Radio.Group>
        </Form.Item>
        </Form>
      </Modal>
    </div>
  );
}

export default connect(
  state=>({types:state.types}),
  {}
)(Modifyvideo);
